{include file="public/header" /}

<body class="gray-bg">
    <div class="wrapper wrapper-content">

             <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                       <button type="button" class="btn btn-primary btn-outline" data-toggle="modal" data-target="#myModal">添加角色</button> 
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            
                            
                        </div>
                    </div>
                    <div class="ibox-content">

                        <table class="table table-striped table-bordered table-hover dataTables-example">
                            <thead>
                                <tr>
                                    <th class="text-center">ID</th>
                                    <th class="text-center">角色名称</th>
                                    <th class="text-center">状态</th>
                                    <th class="text-center">添加时间</th>
                                    <th class="text-center">排序</th>
                                    <th class="text-center">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                              {foreach name="list" item="vo"}
							<tr>
								<td class="text-center">{$vo.id}</td>								
								<td class="text-center">{$vo.title}</td>
								<td class="text-center">
                                            {if condition="$vo.status eq 1"}
                                                <a class="red" href="javascript:;" onclick="rule_state({$vo.id});">
                                                    <div id="zt{$vo.id}"><span class="label label-info">开启</span></div>
                                                </a>
                                            {else/}
                                                <a class="red" href="javascript:;" onclick="rule_state({$vo.id});">
                                                    <div id="zt{$vo.id}"><span class="label label-danger">禁用</span></div>
                                                </a>
                                            {/if} 
                                </td>
								<td class="text-center">{$vo.add_time}</td>
								<td class="text-center">{$vo.sort}</td>
								<td class="text-center">  
									{if $vo.id!=1}
									<a href="{:url('select_role',['id'=>$vo.id])}" class="btn btn-info btn-outline btn-xs">
                                                <i class="fa fa-paste"></i> 权限分配</a>&nbsp;&nbsp;
                                            <a href="{:url('edit_role',['id'=>$vo.id])}" class="btn btn-primary btn-outline btn-xs">
                                                <i class="fa fa-paste"></i> 编辑</a>&nbsp;&nbsp;
                                            <a href="javascript:;" onclick="del_rule({$vo.id})" class="btn btn-danger btn-outline btn-xs">
                                                <i class="fa fa-trash-o"></i> 删除</a> {/if}                                      
                                </td>
							</tr>
							{/foreach}
                            </tbody>
                        </table>

                    </div>
                </div>
            </div>
        </div>
    </div>
{include file="public/footer" /}
<div class="modal  fade" id="myModal" tabindex="-1" role="dialog"  aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h3 class="modal-title">添加角色</h3>                  
                </div>
                <form class="form-horizontal" name="add_role" id="add_role" method="post" action="{:url('add_role')}">
                    <div class="ibox-content">
                           
                            <div class="form-group">
                                <label class="col-sm-3 control-label">角色名称</label>
                                <div class="col-sm-8">
                                    <input type="text" name="title" id="title" placeholder="输入菜单名称" class="form-control"/>
                                </div>
                            </div>                      
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">排&nbsp;序</label>
                                <div class="col-sm-8">
                                    <input type="text" name="sort" id="sort" value="" placeholder="输入排序" class="form-control"/>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                            <label class="col-sm-3 control-label">状&nbsp;态</label>
                            <div class="col-sm-6  control">
                                <div class="mui-input-row mui-radio mui-left">
                                    <input type="radio" name='status' value="1" checked="checked"/>开启&nbsp;&nbsp;
                                    <input type="radio" name='status' value="0" />关闭
                                </div>
                            </div>
                        </div>                  
                        </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary"><i class="fa fa-save"></i> 保存</button>
                        <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-close"></i> 关闭</button>                    
                    </div>
                </form>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript">
   
    $(function(){
        $('#add_role').ajaxForm({
            beforeSubmit: checkForm, 
            success: complete, 
            dataType: 'json'
        });
        
        function checkForm(){
            if( '' == $.trim($('#title').val())){
                layer.msg('请输入菜单名称',{icon:2,time:1500,shade: 0.1}, function(index){
                layer.close(index);
                });
                return false;
            }
            
           
        }


        function complete(data){
            if(data.code==200){
                layer.msg(data.msg, {icon: 6,time:1500,shade: 0.1}, function(index){
                    window.location.href="{:url('index')}";
                });
            }else{
                layer.msg(data.msg, {icon: 6,time:1500,shade: 0.1});
                return false;   
            }
        }
     
    });
/**
 * [del_rule 删除]
 * @param   {[type]}    id [用户id]
 */
function del_rule(id){
    layer.confirm('确认删除?', {icon: 3, title:'提示'}, function(index){
        //do something
        $.getJSON('./delete', {'id' : id}, function(res){
            if(res.code == 200){
                layer.msg(res.msg,{icon:1,time:1500,shade: 0.1},function(index){
                    window.location.href="{:url('index')}";
                });
               
            }else{
                layer.msg(res.msg,{icon:0,time:1500,shade: 0.1});
            }
        });

        layer.close(index);
    })

}

//菜单状态
function rule_state(id){
    lunhui.status(id,'{:url("rule_state")}');
}

</script>
</html>